import type { RouteObject } from "react-router-dom";
import { lazyRoute } from "@/utils/lazy-route";
import RootLayout from "@/components/RootLayout";
// import TsDemo from "@/pages/TsDemo";
import { HomePage, MobxPage, ZustandPage, JotaiPage } from "@/pages";
import {RouterErrorPage} from "@/components/ErrorPage";

const routes: RouteObject[] = [
  {
    path: "/",
    element: <RootLayout />,
    children: [
      {
        index: true,
        element: <HomePage />,
        errorElement: <RouterErrorPage />
      },
      // {
      //   path: "typescript",
      //   element: <TsDemo />,
      // },
      {
        path: "lazy",
        // lazy: () =>
        //   import("@/pages/LazyPage").then((module) => ({
        //     Component: module.default,
        //   })),
        lazy: lazyRoute(() => import("@/pages/LazyPage")),
        errorElement: <RouterErrorPage />
      },
      {
        path: "mobx",
        element: <MobxPage />,
        errorElement: <RouterErrorPage />
      },
      {
        path: "zustand",
        element: <ZustandPage />,
        errorElement: <RouterErrorPage />
      },
      {
        path: "jotai",
        element: <JotaiPage />,
        errorElement: <RouterErrorPage />
      }
    ],
  },
];

export default routes;
